<script setup>
	
</script>
<template>
	<div class="bottombar">
		<!-- 左边细节部分 -->
		<div class="left-detail">
			<ul>
				<li>数码岛简介</li>
				<li>联系我们</li>
				<li>友情链接</li>
				<li>用户协议</li>
				<li>隐私权声明</li>
				<li>法律投诉声明</li>
				<li>网上有害信息举报专区</li>
			</ul>
			<div class="buttom-dispaly">
				<div class="logo">
					<img src="../../../assets/img/logo.jpg" alt="">
				</div>
				<div class="detail-text">
					<span>备注11111111222222222222222222221111111111111111111</span>
					<span>备案号 12dewr3522@dda</span>
					<span>京备案号 12dewr3522@dda</span>
					<span>违法和未成年人不良举报电话：15523453567</span>
					<span>举报邮箱：2341535675@qq.com</span>
				</div>
			</div>
		</div>
		<!-- 右边二维码 -->
		<div class="right-code">
			<div>扫描二维码</div>
			<div><img src="../../../assets/img/logo.jpg" alt=""></div>
		</div>
	</div>

</template>

<script>
</script>

<style lang="scss" scoped>
	li {
		list-style: none;
	}

	.bottombar {
		// width: 100%;
		// height: 200px;
		color:#666;
		background-color: #282c31;
		// margin-top: 30px;

		padding: 30px 50px;
		display: flex;
		justify-content: space-between;
		.left-detail {
			width: 60%;
			color: #959ba2;
			padding-right: 155px;
			border-right: 1px solid#0b1d01;
			font-size: 14px;
			ul {
				width: 100%;
				display: flex;
				flex-wrap: warp;
				justify-content: space-between;
				padding-block-start: 0;
			}
			li{
				padding: 10px 10px;
				&:hover{
					cursor:pointer;
					color:#4f60d3;
				}
			}

		}

		.buttom-dispaly {
			display: flex;
			margin-top: 40px;
			.logo img {
				width: 120px;
				height: 80px;margin-top: 10px;
			}

			.detail-text {
				width: 60%;
				margin-left: 20px;
				display: flex;
				flex-wrap: wrap;
				span {
					color: #666c74;
					font-size: 13px;
					margin-right: 40px;
					padding-bottom: 10px;
				}
			}
		}

		.right-code{
		width: 127px;	
		height: 142px;
		margin-left: 20px;
		div{
			text-align: center;
			margin-top: 12px;
			img{
				width: 120px;
				height: 120px;
			}
		}
		}
	}
</style>
